<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	
	<th:block th:include="include/src :: grid_base_js_and_css"/>
	
	<style type="text/css">
		.left-content{position: absolute;white-space: normal;z-index: 998;width: 230px;height:100%;top:0;left:0;background: #fff;}
		.mail-ul li{padding:0;line-height:30px;min-width: 140px;padding-left:35px;text-align: left;cursor: pointer;font-size:14px;font-weight:400;color:#142A48;}
		.layui-badge{border-radius: 10px;left:0}
		.mid-content{right: 0;box-shadow:0px 15px 10px -15px #000;}
		.content iframe{border: none;width: 100%;height: -webkit-fill-available;}
		.search{margin-top: 10px;;overflow:auto}
		.search table{margin-left: 20px;}
		.search table tr{margin-left:20px;}
		.search table td{height: 35px}
		.search table tr td:first-child{text-align: right;font-size: 11px}
		.search table tr .layui-input{width:140px;padding:0 3px;}
		.icon_date_business{top:11px !important;right:10px !important;}
		.shead{height: 35px;line-height: 35px;text-align: center;color: #fff;font-weight: bolder;font-size: 14px;}
		table label{font-size: 12px;}
		table label input{vertical-align: bottom;zoom: 130%;}
		.dtree-icon-dian{display: none}
		.layui-nav-tree{width: 100%;}
		.dtree-toolbar-fixed a i{font-size: 17px;}
		.content iframe html{background: #fff}
		.layui-btn{border:none;}
		.dtree-nav-item {padding-left: 16px;}
		
		/*.dtree-theme-item cite{}*/
		.layui-btn-xs {height: 32px;line-height: 32px;padding: 0 16px;font-size: 12px;}
		.layui-form-select .layui-edge{right:10px;}
		#dh-resets {margin-left: 0;}
	</style>
</head>
<body>
<div class="main-content">
	<div class="mid-content" style="padding: 0 0 0 230px;">
<!--	<div class="mid-content" style="padding-left:230px;padding-top: 0px;padding-right: 0;">-->
		<div class="mail-tab" style="background: #fff;height: 100vh;border-left: 12px solid #f2f2f2f2">
			<div class="left-content">
				<ul class="mail-ul">
					<li data-url="/web/mail/toAdd" data-type="add"><i class="dhicon dh-zu4130"></i>&nbsp;&nbsp;新建邮件</li>
					<li data-url="/system/mail/mailList?pageType=inbox" data-type="list" class="layui-this"><i class="dhicon dh-zu4042_2"></i>&nbsp;&nbsp;收件箱&nbsp;<p class="layui-badge badge1">0</p></li>
					<li data-url="/system/mail/mailList?pageType=draftbox" data-type="list"><i class="dhicon dh-zu4044_1"></i>&nbsp;&nbsp;草稿箱&nbsp;<p class="layui-badge badge2">0</p></li>
					<li data-url="/system/mail/mailList?pageType=outbox" data-type="list"><i class="dhicon dh-zu4045_2"></i>&nbsp;&nbsp;发件箱&nbsp;</li>
					<li data-url="/system/mail/mailList?pageType=perpetual" data-type="list"><i class="dhicon dh-zu4046_1"></i>&nbsp;&nbsp;保留邮件&nbsp;</li>
					<li data-url="/system/mail/mailList?pageType=deleted" data-type="list"><i class="dhicon dh-zu4047_1"></i>&nbsp;&nbsp;已删除&nbsp;</li>
					<li data-url="/system/mail/mailList?pageType=canceled" data-type="list"><i class="dhicon dh-zu4047_1_1"></i>&nbsp;&nbsp;已撤销&nbsp;</li>
				</ul>
				<div class="search">
					<div class="layui-side-scroll link-book" style="width: 100%;display: none">
						<p class="shead">通讯录</p>
						<div class="layui-nav-tree">
							<div style="text-align: center;margin: 12px 0 5px">
								<button class="layui-btn layui-btn-xs layui-btn-primary" dtree-id="dhtree" dtree-menu="addmenu1" title="新增组" style="background-color:#00A115;"><i class="dtreefont dtree-icon-fenzhijigou"></i></button>
								<button class="layui-btn layui-btn-xs layui-btn-primary" dtree-id="dhtree" dtree-menu="adduser" title="新增成员" style="background-color:#00A115;"><i class="dtreefont dtree-icon-yonghu"></i></button>
								<button class="layui-btn layui-btn-xs layui-btn-primary" dtree-id="dhtree" dtree-menu="bianji" title="编辑" style="background-color:#F3A041;"><i class="dtreefont dtree-icon-bianji"></i></button>
								<button class="layui-btn layui-btn-xs layui-btn-primary" dtree-id="dhtree" dtree-menu="shanchu" title="删除" style="background-color:#C80000;"><i class="dtreefont dtree-icon-roundclosefill"></i></button>
							</div>
							<div id="dhtree"></div>
						</div>
					</div>
					<form id="search-form" class="layui-form">
						<p class="shead">邮件搜索</p>
						<table style="margin-top: 10px;">
							<tr><td width="65">标题：</td><td><input type="text" name="mailSubject" autocomplete="off" class="layui-input"></td></tr>
							<tr><td>正文：</td><td><input type="text" name="mailContent" autocomplete="off" class="layui-input"></td></tr>
							<tr><td>发件人：</td><td><input type="text" name="fromUserName" autocomplete="off" class="layui-input"></td></tr>
							<tr><td>收件人：</td><td><input type="text" name="toUserName" autocomplete="off" class="layui-input"></td></tr>
							<tr><td>邮件标签：</td><td><input type="text" name="mailLabel" autocomplete="off" class="layui-input"></td></tr>
							<tr><td>发送时间：</td>
								<td style="position: relative;"><input type="text" name="sendTime" id="sendTime" class="layui-input">
									<i class="dhicon dh-calendar icon_date_business" style="z-index:1"></i></td></tr>
							<tr>
								<td>紧急程度：</td>
								<td>
									<select name="urgentDegree" id="urgentDegree">
										<option value="">全部</option>
										<option value="普通">普通</option>
										<option value="加急">加急</option>
										<option value="特急">特急</option>
									</select>
								</td>
							</tr>
							<tr>
								<td>邮件状态：</td>
								<td>
									<select name="readed" id="readed">
										<option value="">全部</option>
										<option value="1">已读</option>
										<option value="0">未读</option>
									</select>
								</td>
							</tr>
							<tr>
								<td>重要邮件：</td>
								<td>
									<select name="important" id="important">
										<option value="">全部</option>
										<option value="1">是</option>
										<option value="0">否</option>
									</select>
								</td>
							</tr>
							<tr>
								<td>保留邮件：</td>
								<td>
									<select name="perpetual" id="perpetual">
										<option value="">全部</option>
										<option value="1">是</option>
										<option value="0">否</option>
									</select>
								</td>
							</tr>
							<tr>
								<td colspan="2" style="text-align: center;height: 50px;">
									<div class="layui-btn" onclick="search()">
										<p class="dhicon dh-search" style="color:white;font-size:14px"><span class="fa_span">搜 索</span></p></div>
									<div class="layui-btn layui-btn-primary" style="background: #fff !important" onclick="cleanParam()">
										<p class="dhicon dh-refresh" style="color:white;font-size:14px" id="dh-resets"><span class="fa_span">重 置</span></p></div>
								</td>

							</tr>
						</table>
					</form>
				</div>
			</div>
			<div class="content" style="margin-left: 12px;margin-top: 0px;height: 100%;">
				<iframe id="mailbox" src="/system/mail/mailList?pageType=inbox"></iframe>
			</div>
		</div>

	</div>
</div>
<div id="addmenu1" style="display: none;width: 80%;margin-top: 10px;">
	<form class="post_form">
		<input type="hidden" name="guid" id="guid">
		<input type="hidden" name="pguid" id="pguid">
		<input type="hidden" name="vtype" id="vtype">
		<!--<div class="layui-form-item">
			<label class="layui-form-label">上级：</label>
			<div class="layui-input-block">
				<input type="text" id="pname" readonly="readonly" autocomplete="off" class="layui-input">
			</div>
		</div>-->
		<div class="layui-form-item">
			<label class="layui-form-label"><font class="f_red">*</font>名称：</label>
			<div class="layui-input-block">
				<input type="text" name="title" id="title" autocomplete="off" class="layui-input">
			</div>
		</div>
	</form>
</div>
<script>
	$(".mid-content").css('border','0px solid #ff0000;');
	$(".left-content").css('border-right','1px dashed #ff0000;');
	$(".search").css('border-top','double #ff0000;');
	$(".box11").css('height',$(window).height()-100);
	$(".search").css('height',$(window).height()-300);
	$(".content").css('height',$(window).height()-34);

	$(".shead").css({'background':pellucidityTen,"border-radius":"4px 4px 0px 0px;"});
	$(".layui-this").css("background",pellucidityFive);
	$(".mail-ul").on("click","li",function(){
		$(".mail-ul li").removeClass("layui-this");
		$(".mail-ul li").css("background","#FFF");
		$(this).addClass("layui-this");
		$(this).css("background",pellucidityFive);
		$('#mailbox').attr('src', $(this).attr("data-url"));
		if($(this).attr("data-type") == 'add'){
			$(".link-book").css("display","block")
			$("#search-form").css("display","none")
		}else{
			$(".link-book").css("display","none")
			$("#search-form").css("display","block")
		}
		cleanParam();
	})
	refreshMail();
	//刷新邮件数量
	function refreshMail(){
		$.get('/system/mail/listwds',function(res){
			$('.badge1').text(res.data[0].mailWdCount);	//未读收件任务数
			$('.badge2').text(res.data[0].mailCgCount);	//草稿邮件数
			if(Number(res.data[0].mailWdCount)>0){		//修改导航栏的未读收件任务数
				$('.badge1').show();
				parent.$('#unreadMail').show();
				parent.$('#unreadMail').text(Number(res.data[0].mailWdCount));
			}else {
				parent.$('#unreadMail').hide();
				$('.badge1').hide();
			}
			if(Number(res.data[0].mailCgCount)>0){		//修改列表草稿
				$('.badge2').show();
			}else {
				$('.badge2').hide();
			}
		});
	}
	var $,layer,form,element,laydate;
	var CommonTreet;
	var focus_obj;//新建页焦点对象
	var treeData; //树数据对象
	layui.extend({
		dtree : '/js/layuiadmin-1.2.1/lib/extend/dtree-tp'
	}).use(['layer','element','laydate','form', 'util','dtree'], function () {
		$ = layui.jquery,
				layer = layui.layer,
				form = layui.form,
				laydate = layui.laydate,
				element = layui.element,
				util = layui.util,dtree = layui.dtree;
		treeData = getTree('/system/mail/listtreejson');
		CommonTreet = dtree.render({
			elem: "#dhtree",
			menubar:true,
			record:true,
			toolbar:true,
			toolbarWay:"follow",
			// toolbarShow:["edit"],
			toolbarShow:[], // 默认按钮制空
			toolbarExt:[
				{toolbarId: "forinput",icon:"dtree-icon-roundright",title:"全选",handler: function(node,$div){
						$.each(treeData,function (i,v){
							if(node.nodeId == v.id){
								$.each(v.children,function (i2,v2){
									if($("#mailbox")[0].contentWindow.focus_obj == 'toUser'){
										$("#mailbox")[0].contentWindow.forUser(v2.title+' ['+v2.orgid+']',$("#mailbox")[0].contentWindow.toUserName_obj,'toUserName','toUser','toUser_D',true);
										$("#mailbox")[0].contentWindow.forUser('['+v2.vtype+']'+v2.orgid,$("#mailbox")[0].contentWindow.toUser_obj,'toUser','','',true);
									}else if($("#mailbox")[0].contentWindow.focus_obj == 'ccUser'){
										$("#mailbox")[0].contentWindow.forUser(v2.title+' ['+v2.orgid+']',$("#mailbox")[0].contentWindow.ccUserName_obj,'ccUserName','ccUser','ccUser_D',true);
										$("#mailbox")[0].contentWindow.forUser('['+v2.vtype+']'+v2.orgid,$("#mailbox")[0].contentWindow.ccUser_obj,'ccUser','','',true);
									}
								})
							}
						})
					}},
				/*{toolbarId: "addmenu",icon:"dtree-icon-jia",title:"新增组",handler: function(node,$div){
					$('.post_form')[0].reset();
					$("#pguid").val(node.nodeId);
					$("#vtype").val("menu");
					openHtml('新增组','400','150',"addmenu1",'/system/mail/addbookpost',"post_form",function(result){
						treeReload(result);
					},'',false);
				}},*/
				{toolbarId: "add",icon:"dtree-icon-jia1",title:"新增成员",handler: function(node,$div){
						var title = '选择对象',url = "/system/organization/orgObjectSelect?pagetype=checkbox&by=direct",areaObj = ['700px', '490px'];
						addObjectOrg(title,url,areaObj,node);
					}},
				{toolbarId: "edit",icon:"dtree-icon-bianji",title:"编辑",handler: function(node,$div){
						$("#guid").val(node.nodeId);
						$("#title").val(node.context);
						$("#vtype").val(node.recordData.vtype);
						purl = '/system/mail/editbookpost';
						openHtml('编辑组','400','150',"addmenu1",purl,"post_form",function(result){
							treeReload(node.parentId)
						},'',true);
					}},
				{toolbarId: "delete",icon:"dtree-icon-close-fill",title:"删除",handler: function(node,$div){
						if(node.leaf == false){
							$.modal.confirmCom('当前选中的节点下有子级，确定要一起删除么？',function(){deletepost(node.nodeId,node.parentId);$('.post_form')[0].reset();});
						}else{
							$.modal.confirmCom('你确定删除么？',function(){deletepost(node.nodeId,node.parentId);$('.post_form')[0].reset();});
						}

					}}
			],
			toolbarFun: {
				loadToolbarBefore: function(buttons, param, $div){
					if(param.leaf == true){
						buttons.forinput = "";
					}
					var nodeJson = JSON.parse(param.recordData);    //后台传回的节点参数（字符串）
					if(nodeJson.allowAdd == false){  //新增
						buttons.add = "";  		// 取消新增功能
						// buttons.addmenu = "";  	// 取消新增功能
					}
					if(nodeJson.allowEdit == false){  //编辑
						buttons.edit = "";  // 取消编辑功能
					}
					if(nodeJson.allowDelete == false){  //删除
						buttons.delete = "";  // 取消删除功能
					}
					return buttons; // 将按钮对象返回
				}
			},
			data: treeData,
			icon: "-1",
			menubarTips:{
				freedom:[{
					menubarId:"addmenu1",handler:function(node){nodeHandler(node,'新增组','addmenu');}
				},{
					menubarId:"adduser",handler:function(node){nodeHandler(node,'新增成员','adduser');}
				},{
					menubarId:"bianji",handler:function(node){nodeHandler(node,'修改','edit');}
				},{
					menubarId:"shanchu",handler:function(node){nodeHandler(node,'删除','delete');}
				}
				],
				group:[] // 按钮组制空
			}
		});
		//取消树节点选中
		$(document).bind('click', function(event) {
			var evt = event.srcElement ? event.srcElement : event.target;
			evt = $(evt);
			if(evt.hasClass("layui-nav-tree") || evt.parents(".layui-nav-tree").length != 0 || evt.hasClass("layui-layer-page") || evt.parents(".layui-layer-page").length != 0
					|| evt.hasClass("layui-body") || evt.parents(".layui-body").length != 0 || evt.hasClass("layui-layer-btn") || evt.parents(".layui-layer-btn").length != 0
					|| evt.hasClass("layui-layer-setwin") || evt.parents(".layui-layer-setwin").length != 0)
				return;
			else{
				CommonTreet.cancelNavThis();
			};
		});
		function nodeHandler(node,dname,action){
			var purl;
			if(Object.keys(node).length==0 && action != 'addmenu'){
				layer.msg("请选择节点");
			}else{
				var post_serialize = true;
				if(action != 'edit' && action != 'delete' && action != 'adduser'){
					var pguidv = 'root';
					if(Object.keys(node).length > 0){
						var nodeJson = JSON.parse(node.recordData);    //后台传回的节点参数（字符串）
						if(action == 'addmenu' && nodeJson.vtype == 'user') {
							layer.msg("通讯对象下面不能添加！");
							return false;
						}
						if(!nodeJson.allowAdd){
							layer.msg("系统默认组下面不能添加！");
							return false;
						}
						pguidv = node.nodeId;
					}
					$('.post_form')[0].reset();
					$("#pguid").val(pguidv);
					$("#vtype").val("menu");
					purl = '/system/mail/addbookpost';
					post_serialize = false;
				}else{
					var nodeJson = JSON.parse(node.recordData);    //后台传回的节点参数（字符串）
					if(!nodeJson.allowEdit){
						layer.msg("不能编辑‘默认组’或‘通讯对象’！");
						return false;
					}
					$("#guid").val(node.nodeId);
					$("#title").val(node.context);
					$("#vtype").val("menu");
					purl = '/system/mail/editbookpost';
				}
				if(action == 'delete'){
					var nodeJson = JSON.parse(node.recordData);    //后台传回的节点参数（字符串）
					if(!nodeJson.allowDelete){
						layer.msg("‘默认组’或‘通讯对象’，不能删除！");
						return false;
					}
					if(node.leaf == false){
						$.modal.confirmCom('当前选中的节点下有子级，确定要一起删除么？',function(){deletepost(node.nodeId,node.parentId);$('.post_form')[0].reset();});
					}else{
						$.modal.confirmCom('你确定删除么？',function(){deletepost(node.nodeId,node.parentId);$('.post_form')[0].reset();});
					}
				}else if(action == 'adduser' && Object.keys(node).length>0){
					var nodeJson = JSON.parse(node.recordData);    //后台传回的节点参数（字符串）
					if(!nodeJson.allowAdd){
						layer.msg("不能在‘默认组’或‘通讯对象’下面新增！");
						return false;
					}
					var title = '选择对象',url = "/system/organization/orgObjectSelect?pagetype=checkbox&by=direct",areaObj = ['700px', '490px'];
					addObjectOrg(title,url,areaObj,node);
				}else{
					openHtml(dname,'400','150',"addmenu1",purl,"post_form",function(result){
						treeReload(node.parentId?node.parentId:node.nodeId);
					},'',post_serialize);
				}
			}
		}
		//删除操作
		function deletepost(guid, pguid){
			var deldata = {'guid':guid};
			$.operate.post('/system/mail/deletebookpost',deldata,function(result){
				treeReload(pguid)
			});
		}
		//数节点点击事件
		dtree.on("node('dhtree')" ,function(obj){
			var nodeJson = JSON.parse(obj.param.recordData);    //后台传回的节点参数（字符串）
			if(nodeJson.vtype != "menu"){
				if($("#mailbox")[0].contentWindow.focus_obj == 'toUser'){
					$("#mailbox")[0].contentWindow.forUser(obj.param.context+' ['+nodeJson.orgid+']',$("#mailbox")[0].contentWindow.toUserName_obj,'toUserName','toUser','toUser_D',true);
					$("#mailbox")[0].contentWindow.forUser('['+nodeJson.vtype+']'+nodeJson.orgid,$("#mailbox")[0].contentWindow.toUser_obj,'toUser','','',true);
				}else if($("#mailbox")[0].contentWindow.focus_obj == 'ccUser'){
					$("#mailbox")[0].contentWindow.forUser(obj.param.context+' ['+nodeJson.orgid+']',$("#mailbox")[0].contentWindow.ccUserName_obj,'ccUserName','ccUser','ccUser_D',true);
					$("#mailbox")[0].contentWindow.forUser('['+nodeJson.vtype+']'+nodeJson.orgid,$("#mailbox")[0].contentWindow.ccUser_obj,'ccUser','','',true);
				}
			}
		});
		form.render();
		laydate.render({
			elem: '#sendTime'
			,type: 'datetime'
			,theme: JSON.parse(window.localStorage.getItem('layuiAdmin')).theme.color.header
			,range: '~'
		});
	});
	//数重载
	function treeReload(nodeid){
		treeData = getTree('/system/mail/listtreejson');
		dtree.reload(CommonTreet,{
			elem: "#dhtree",
			data: treeData,
			done: function(){
				var params = dtree.dataInit("dhtree", nodeid);
			}
		});
	}
	//邮件搜索
	function search(){
		var whereObj = $("#search-form").serializeObject();
		if(whereObj['sendTime']){
			var st=whereObj['sendTime'].split('~');
			whereObj['sendTime_s']=st[0].substring(0,st[0].length-1);
			whereObj['sendTime_e']=st[1].substring(1,st[1].length);
		}
		if(!whereObj['important'])whereObj['important'] = '';
		if(!whereObj['perpetual'])whereObj['perpetual'] = '';
		if(!whereObj['readed'])whereObj['readed'] = '';
		if(!whereObj['urgentDegree'])whereObj['urgentDegree'] = '';
		$("#mailbox")[0].contentWindow.closeView();
		$("#mailbox")[0].contentWindow.reloadTable(whereObj);
	}
	$.fn.serializeObject = function()
	{
		var o = {};
		var a = this.serializeArray();
		$.each(a, function() {
			if (o[this.name]) {
				if (!o[this.name].push) {
					o[this.name] = [o[this.name]];
				}
				o[this.name].push(this.value || '');
			} else {
				o[this.name] = this.value || '';
			}
		});
		return o;
	};
	//清空条件
	function cleanParam(){
		$("#search-form :input").not(":button, :submit, :reset, :hidden, :checkbox, :radio").val("");
		$("#search-form :input").removeAttr("checked").remove("selected");
		$("#search-form select").val("");
		form.render();
	}
	//弹出框表单
	function openHtml(title, width, height, did, purl, calssdata, callback, infoItems, post_serialize){
		var infoItems = infoItems || "infoItems";
		layer.open({
			type: 1,
			area: [width + 'px', height + 'px'],
			offset: '10%',
			title: title,
			shade: 0.6,
			shadeClose: true,
			maxmin: true,
			content: $('#'+did),
			btn: ['保存', '取消'],
			yes: function(index){
				if(post_serialize){
					var form_data = $("."+calssdata).serialize();
				}else{
					var infoArr = {}, form_data = {};
					$.each($("."+calssdata).serializeArray(), function(i, field){
						infoArr[field.name] = field.value;
					});
					form_data[infoItems] = JSON.stringify([infoArr]);
				}
				//邮件系统新增编辑判断
				if(did == 'addmenu1'){
					if(!$("#title").val()){layer.msg("名称不能为空！");return false;}
				}
				$.operate.post(purl,form_data,callback);
				$("."+calssdata)[0].reset();
				layui.form.render();
				layer.closeAll();
			},
			btn2: function(){
				$("."+calssdata)[0].reset();
				layui.form.render();
				layer.closeAll();
			},
			end: function(){$("."+calssdata)[0].reset();layui.form.render();}
		});
	}
	//新增对象弹出框
	function addObjectOrg(title,url,areaObj,node){
		layer.open({
			type: 2
			,area: areaObj
			,offset: '10%'
			,title: title
			,shade: 0.6
			,maxmin: true
			,content: url
			,btn: ['确定', '关闭']
			,yes: function(index){
				var res = window["layui-layer-iframe" + index].callbackdata();
				if(res.length > 0){
					var pd=[];
					$.each(res,function(i,v){
						pd.push({pGuid:node.nodeId,title:v.orgName,vtype:v.orgKind,orgid:v.orgid});
					})
					var postData = {'infoItems':JSON.stringify(pd)};//转化为json字符串格式
					$.operate.post('/system/mail/addbookpost', postData, function(res){
						if(res.code == 0){
							layer.closeAll();
							treeReload(node.nodeId);
						}
					});
				}
			}
		})
	}
</script>
</body>
</html>